<template>
  <view class="taskList">
    <pit-header :title="title" :showBack="false"></pit-header>
    <view class="taskList-content">
      <view v-for="(item,index) in taskList" :key="index" class="taskList-content-item" @click="goNextcontent(item)">
        <img :src="getContentItemIcon(item)" alt="图片" width="50px" height="50px" />
        <text class="taskList-content-item-text">{{item.fullName}}</text>
        <view class="taskList-content-item-message">{{item.totalNum}}</view>
      </view>
    </view>
  </view>
</template>

<script>
  import {
    apiBpmTaskRunTaskCustomTaskListTotal
  } from '@/api/bpm/task.js'
  export default {
    data() {
      return {
        taskList: [],
        title:"任务中心"
      }
    },
    created() {
      this.init()
    },
    methods: {
      init() {
        apiBpmTaskRunTaskCustomTaskListTotal().then(res => {
          if (res.code === '00000') {
            this.taskList = res.data;
          } else {
            uni.showToast({
              title: '菜单获取失败',
              icon: 'none'
            });
          }
        });
      },
      goNextcontent(item) {
        uni.navigateTo({
          url: `/pages/other/taskList/taskListchild?enCode=${item.enCode}&title=${encodeURIComponent(item.fullName)}`
        });
      },
      getContentItemIcon(item) {
        const iconMap = {
          '9e9205fb43da4b88a24bb1eebd626ff0': '/static/home/taskList/saleManage.png',
          '972acb74d15e493aae4f471e16518bef': '/static/home/taskList/personnelManage.png',
          '1689188423888789504': '/static/home/taskList/prophaseManagement.png',
          'ce51233654ee4d1890c7c081a04da2be': '/static/home/taskList/assetsManage.png',
          'e8bfa8ac60d34361b815b48c494f3e06': '/static/home/taskList/contractManage.png',
          '1689194011758682112': '/static/home/taskList/corporateRegulation.png',
          '1627955197710680064': '/static/home/taskList/supervisionManagement.png',
          '1648504388803448832': '/static/home/taskList/progressManage.png',
          '1627954974510792704': '/static/home/taskList/Ecology.png',
          '1608012908026183680': '/static/home/taskList/verification.png',
          'c92985dbcdd648c6a98b272a8f09698e': '/static/home/taskList/serviceSupport.png',
          'be6b516477ed41dab4d0777336e58ddf': '/static/home/taskList/routine.png',
          '1627955084200230912': '/static/home/taskList/designManage.png',
          '1613337793705226240': '/static/home/taskList/construction.png',
          '1660886049879166976': '/static/home/taskList/Ecology.png',
          '1680741606746271744': '/static/home/taskList/scientificResearchManagement.png'
        };
        if (iconMap[item.id]) {
          return iconMap[item.id];
        }
        return '/static/home/taskList/default.png';
      },
    }
  }
</script>

<style lang="scss" scoped>
  .taskList {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100vh;
    background-color: rgb(240, 245, 252);

    .taskList-content {
      display: flex;
      flex-direction: column;
      padding: 10px 15px;
      max-height: calc(100vh - 130px);
      overflow-y: auto;

      .taskList-content-item {
        display: flex;
        align-items: center;
        margin-bottom: 10px;
        padding: 15px;
        background-color: white;
        border-radius: 10px;

        .taskList-content-item-text {
          flex: 1;
          margin-left: 15px;
          font-size: 15px;
        }

        .taskList-content-item-message {
          margin-right: 20px;
          background-color: red;
          color: white;
          font-size: 13px;
          font-weight: 400;
          text-align: center;
          width: 17px;
          padding: 3px 5px;
          border-radius: 5px;
        }

      }
    }

  }
</style>
